import React, { useEffect, useState}  from "react";
import {getHistoryRemark} from 'api/index'
import {Modal,Tabs} from 'antd'
import LlxTable from 'components/LlxTable'

const {TabPane} = Tabs

const LookMore = (props) => {
  const {isModalVisible, setIsModalVisible,type,getId} = props
  const id = getId||window.location.href.slice(window.location.href.indexOf('id=')+3)

  useEffect(()=>{
    isModalVisible&&getHistoryList()

  },[isModalVisible])// eslint-disable-line react-hooks/exhaustive-deps

  
 //分页数据
const [pagination,setPagination] = useState({
  current:1,
  pageSize:10
})
//初始表格数据
const [dataSource,setDataSource] = useState([])
const [loading,setLoading] = useState(false)
const [total,setTotal] = useState(0)
//表头配置信息
const columns = [
      {title: '状态变更', dataIndex: 'statusNext', key: 'statusNext', align: 'center',render:(text,row)=>{
        return <div>
        {row.statusNow} → {row.statusNext}
        </div>
      }},
      {title: '留言', dataIndex: 'remark', key: 'remark', align: 'center'},
      {title: '更新人', dataIndex: 'updateBy', key: 'updateBy', align: 'center'},
      {title: '更新时间', dataIndex: 'updateTime', key: 'updateTime', align: 'center'}
]
 
 
 const handleCancel = () => {
    setIsModalVisible(false);
 };

 const getHistoryList = async(value) => {
  setLoading(true)
  const res = await getHistoryRemark({ id: id, type:type, currPage:value&&value.pageSize?value.current:pagination.current,
  pageSize:value&&value.pageSize?value.pageSize:pagination.pageSize})
  setDataSource(res.result.records)
  setTotal(res.result.total)
  setLoading(false)
 }


 function callback(key) {
  console.log(key);
}

return   <Modal wrapClassName='get-more' width={800} title="查看更多" visible={isModalVisible} footer={null} onCancel={handleCancel}>
         <Tabs defaultActiveKey="1" onChange={callback}>
          <TabPane tab="历史记录" key="1">
           {/* 表格 */}
             <LlxTable
              loading={loading} 
              pagination={pagination}
              setPagination={setPagination}
              selectedRowShow={false}
              height={640}
              total={total}
              getNewList={getHistoryList}
              columns={columns}
              dataSource={dataSource}/>
          </TabPane>
         </Tabs>
 </Modal>
}

export default LookMore